<template>
  <div class="case-detatil-one">
    <div class="case-title">
      进件信息
    </div>
    <config-form
      v-if="productType == 'JXD'"
      :initData="basicForm"
      :span="6"
      :options="BASIC_FORM"
    />
    <!--  吉用贷布局 -->
    <detail-from-for-jyd v-if="productType == PRODUCTTYPE.JYD" :basicForm="basicForm"></detail-from-for-jyd>
    <!-- 吉享贷影像 -->
    <template v-if="productType == PRODUCTTYPE.JXD">
      <el-tabs v-model="activeName">
        <el-tab-pane
          v-for="(value, key) in IMAGE_TYPE"
          :key="key"
          :label="value + '(' + imageAll[key].length + ')'"
          :name="key"
        >
          <image-preview
            :imageList="imageAll[key]"
            :previewList="previewList[key]"
          ></image-preview>
        </el-tab-pane>
      </el-tabs>
    </template>
    <!-- 吉用贷影像 -->
    <template v-if="productType == PRODUCTTYPE.JYD">
      <el-tabs v-model="activeName">
        <el-tab-pane
          v-for="(value, key) in IMAGE_JYDTYPE"
          :key="key"
          :label="value + '(' + jydimageAll[key].length + ')'"
          :name="key"
        >
          <image-preview
            :imageList="jydimageAll[key]"
            :previewList="jydPreviewList[key]"
          ></image-preview>
        </el-tab-pane>
      </el-tabs>
    </template>
    <!-- 合约 -->
    <el-tabs v-model="agreementActive">
      <el-tab-pane
        v-for="(value, key) in contractType"
        :key="key"
        :label="value + '(' + allContract[key].length + ')'"
        :name="key"
      >
        <template v-if="productType == PRODUCTTYPE.JXD">
          <image-preview
            :imageList="allContract[key]"
            :previewList="previewList[key]"
          ></image-preview>
        </template>
        <template v-if="productType == PRODUCTTYPE.JYD">
          <image-preview
            :imageList="allContract[key]"
            :previewList="jydPreviewList[key]"
          ></image-preview>
        </template>
      </el-tab-pane>
    </el-tabs>
    <div class="case-title">
      贷前调查信息
    </div>
    <template v-if="productType == PRODUCTTYPE.JXD">
      <config-form
        :initData="basicForm"
        :span="6"
        :options="OTHER_FORM['JXD']" />
    </template>
    <template v-if="productType == PRODUCTTYPE.JYD">
      <config-form
        :initData="basicForm"
        :span="6"
        :options="OTHER_FORM['JYD']"
      />
      <config-form
        :initData="basicForm"
        :span="6"
        :options="OTHER_FORM['JYD2']"
      />
      <config-form
        :initData="basicForm"
        :span="6"
        :options="OTHER_FORM['JYD3']"
      />
      <config-form
        :initData="basicForm"
        :span="6"
        :options="OTHER_FORM['JYD4']"
      />
    </template>
    <el-row>
      <el-col :span="24">
        <div class="app-tips">
          <div>
            审批备注
          </div>
          <el-form>
            <el-form-item>
              <el-input
                disabled
                v-model="basicForm.auditAdvice"
                resize="none"
                type="textarea"
                rows="3"
                show-word-limit
                clearable
              ></el-input>
            </el-form-item>
          </el-form>
        </div>
      </el-col>
    </el-row>
    <el-tabs v-model="otherActive">
      <el-tab-pane
        v-for="(value, key) in dqdcType"
        :key="key"
        :label="value + '(' + dqdcEnter[key].length + ')'"
        :name="key"
      >
        <image-preview
          v-if="dqdcEnter[key]"
          :imageList="dqdcEnter[key]"
          :previewList="previewList[key]"
        ></image-preview>
      </el-tab-pane>
    </el-tabs>
    <div class="line-details"></div>
    <el-row>
      <el-col :span="24" :offset="23">
        <el-button size="small" plain type="primary" @click="close"
          >关闭</el-button
        >
      </el-col>
    </el-row>
  </div>
</template>

<script>
import {
  BASIC_FORM,
  IMAGE_TYPE,
  OTHER_FORM,
  BASIC_FORM2,
  BASIC_FORM3,
  IMAGE_JYDTYPE,
  PRODUCTTYPE
} from "../js/contant.js";
import api from "../api";
import { mapState } from "vuex";
import { CONSTANT_OBJ } from "@/utils/constant";
import { disposePhone, encryptIdNo, encryptName } from "@/utils/util";
import DetailFromForJyd from './DetailFromForJyd.vue'

export default {
  components: {
    DetailFromForJyd
  },
  props: {
    caseId: {
      type: String,
      default: ""
    },
    researchId: {
      type: String,
      default: ""
    },
    productType: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      BASIC_FORM,
      IMAGE_TYPE,
      IMAGE_JYDTYPE,
      PRODUCTTYPE,
      OTHER_FORM,
      BASIC_FORM2,
      BASIC_FORM3,
      // test,
      basicForm: {},
      activeName: "TAX",
      agreementActive: "",
      otherActive: "",
      approvalRecordList: [],
      imageAll: {
        TAX: [],
        HOUSE_FUND: [],
        INSURANCE: [],
        ASSET: [],
        EDUCATION: [],
        SALARY: [],
        VISIT: [],
        OTHER: []
      },
      jydimageAll: {
        MARRIAGE: [],
        GUARANTEE: [],
        RENT: [],
        VISIT: [],
        CLEAN_PRACTICE: [],
        INCOME: [],
        DUE_DILIGENCE: [],
        OTHER: [],
        HOUSE_FUND_TAX_SALARY: []
      },
      jydPreviewList: {
        MARRIAGE: [],
        GUARANTEE: [],
        RENT: [],
        VISIT: [],
        CLEAN_PRACTICE: [],
        INCOME: [],
        DUE_DILIGENCE: [],
        OTHER: [],
        HOUSE_FUND_TAX_SALARY: []
      },
      previewList: {
        TAX: [],
        HOUSE_FUND: [],
        INSURANCE: [],
        ASSET: [],
        EDUCATION: [],
        SALARY: [],
        VISIT: [],
        OTHER: []
      },
      allContract: {},
      contractType: {},
      dqdcEnter: {},
      dqdcType: {}
    };
  },
  mounted() {
    console.log(this.caseId, "案件id");
    console.log(this.productType, "产品类型");
    this.getBasicData();
    this.getImageListInformation();
  },
  methods: {
    // 获取基本数据
    getBasicData() {
      api.getBasicInfoData(this.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let bData = { ...data } || {};
          bData.newProduct = this.dicts["product_type"].childMap[
            data.productType
          ];
          console.log("bData", bData);
          this.getCustomerInformation(bData);
          // this.getContactList(bData)
        }
      });
    },
    // 获取客户信息
    getCustomerInformation(bData) {
      api.getCustomerInfo(this.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = { ...data } || {};
          result.nowAddr = `${data.homeAddress.province}-${data.homeAddress.city}-${data.homeAddress.town}-${data.homeAddress.street}`;
          result.idDate = `${data.idBeginDate} 至 ${data.idEndDate}`;
          result.newMarital = this.dicts["marital_status"].childMap[
            data.maritalStatus
          ];
          result.newEducation = this.dicts["education"].childMap[
            data.education
          ];
          result.newHouseStatus = this.dicts["house_status"].childMap[
            data.houseStatus
          ];
          result.newPhone = disposePhone(result.customerPhone);
          result.newName = encryptName(result.customerName);
          result.newIdNbr = encryptIdNo(result.idNbr);
          let cData = Object.assign(bData, result);
          this.getCareerInformation(cData);
        }
      });
    },
    // 获取职业信息
    getCareerInformation(bData) {
      api.getCareerInfo(this.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = { ...data } || {};
          result.organAddr = `${data.organAddress.province}-${data.organAddress.city}-${data.organAddress.town}`;
          result.newWorkTime = this.dicts["work_time"].childMap[data.workTime];
          let cData = Object.assign(bData, result);
          this.getContactInformation(cData);
        }
      });
    },
    // 获取联系人信息
    getContactInformation(bData) {
      api.getContactInfo(this.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = {};
          result.contactName_1 = encryptName(data[0].contactName);
          result.contactPhone_1 = disposePhone(data[0].contactPhone);
          result.contactRelation_1 = this.dicts["contact_relation_1"].childMap[
            data[0].contactRelation
          ];
          result.isKnow_1 = data[0].isKnow === "Y" ? "是" : "否";
          result.contactName_2 = encryptName(data[1].contactName);
          result.contactPhone_2 = disposePhone(data[1].contactPhone);
          result.contactRelation_2 = this.dicts["contact_relation_2"].childMap[
            data[1].contactRelation
          ];
          result.isKnow_2 = data[1].isKnow === "Y" ? "是" : "否";
          let cData = Object.assign(bData, result);
          if (this.productType === "JXD") {
            this.getByResearch(cData);
          }
          if (this.productType === "JYD") {
            this.queryByCaseId(cData);
          }
        }
      });
    },
    // 获取房抵信息
    queryByCaseId(bData) {
      const params = {
        caseId: this.caseId
      };
      api.queryByCaseId(params).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = { ...data } || {};
          let cData = Object.assign(bData, result);
          this.getByResearch(cData);
        }
      });
    },
    // 获取申请件跟进详情
    getByResearch(bData) {
      api.getByResearchInfo({ researchId: this.researchId }).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = { ...data } || {};
          let checkRes = JSON.parse(result.checkResult);
          checkRes.forEach(ele => {
            result[ele.imgSubType] = this.dicts["confirm_type"].childMap[
              ele.checkResult
            ];
          });
          result["newAuditResult"] = this.dicts["audit_result"].childMap[
            result.auditResult
          ];
          this.basicForm = Object.assign(bData, result);
        }
      });
    },
    /**
     * @description 通过caseId查询申请件审批记录
     */
    getApprovalRecordData() {
      api.getAuditData(this.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = [...data] || [];
          this.approvalRecordList = result;
        }
      });
    },
    // 获取影像信息
    getImageListInformation() {
      api.getImageInfo(this.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          console.log(data, "影像信息");
          this.disposeImage(data);
          this.disposeContract(data);
        }
      });
    },
    disposeImage(list) {
      let type = Object.prototype.toString.call(list);
      if (type === "[object Object]") return;
      if (this.productType == PRODUCTTYPE.JXD) {
        let keys = Object.keys(this.IMAGE_TYPE);
        let filterImg = list.filter(ele => keys.includes(ele.imgType));
        filterImg.forEach(v => {
          this.previewList[v.imgType] = v.urls.map(ele => {
            return ele.url;
          });
          this.imageAll[v.imgType] = [...v.urls];
        });
        console.log(this.imageAll, "影像结果");
      } else if (this.productType == PRODUCTTYPE.JYD) {
        // 吉用贷
        const a = {
          HOUSE_FUND: "公积金",
          TAX: "个税",
          INCOME: "收入证明",
          VISIT_LOGO: '亲访照片',
          VISIT_UNIT: '亲访照片',
          VISIT_DOOR: '亲访照片',
          VISIT_GROUP: '亲访照片',
          VISIT_INSIDE: '亲访照片',
          VISIT_PROPERTY: '亲访照片',
          VISIT_FLOOR: '亲访照片'
        };
        let b = Object.assign({}, a, this.IMAGE_JYDTYPE);
        let keys = Object.keys(b);
        let filterImg = list.filter(ele => keys.includes(ele.imgType));
        filterImg.forEach(v => {
          const obj = {
            HOUSE_FUND: "公积金/个税/收入证明",
            TAX: "公积金/个税/收入证明",
            INCOME: "公积金/个税/收入证明"
          };
          if (obj[v.imgType]) {
            // this.jydPreviewList[v.imgType] = v.urls.map(ele => {
            //   return ele.url;
            // });
            this.jydimageAll["HOUSE_FUND_TAX_SALARY"] = [
              ...this.jydimageAll["HOUSE_FUND_TAX_SALARY"],
              ...v.urls
            ];
            if (v.urls && v.urls.length>0) {
              v.urls.forEach(url => {
                this.jydPreviewList['HOUSE_FUND_TAX_SALARY'].push(url.url)
              });
            }
          } else {
            console.log('>>>>>>>>>>>>>>>>>', v.imgType);
            if (v.imgType == 'VISIT_LOGO' || v.imgType == 'VISIT_UNIT' 
                || v.imgType == 'VISIT_DOOR' || v.imgType == 'VISIT_GROUP' || v.imgType == 'VISIT_INSIDE'
                || v.imgType == 'VISIT_PROPERTY' || v.imgType == 'VISIT_FLOOR' ) {
              // 如果是亲访子类
              console.log('是亲访子类：', v.imgType);
              if (v.urls && v.urls.length>0) {
                v.urls.forEach(url => {
                  this.jydimageAll['VISIT'].push(url)
                  this.jydPreviewList['VISIT'].push(url.url)
                });
              }
            } else {
              this.jydimageAll[v.imgType] = [...v.urls];
              this.jydPreviewList[v.imgType] = v.urls.map(ele => {
                return ele.url;
              });
            }
          }
        });
        console.log(this.jydimageAll, "吉用贷影像结果");
      }
    },
    close() {
      this.$emit("close", false);
    },
    disposeContract(list) {
      let type = Object.prototype.toString.call(list);
      if (type === "[object Object]") return;
      const reg = /[\u4e00-\u9fa5]/g;
      let filterRes = list.filter(v => v.imgType === "CONTRACT");
      if (filterRes.length === 0) return;
      filterRes[0].urls.forEach(ele => {
        if (ele.fileName.match(reg).join("") !== "贷前调查确认函") {
          this.contractType[
            ele.fileName.match(reg).join("")
          ] = ele.fileName.match(reg).join("");
          this.allContract[ele.fileName.match(reg).join("")] = [];
        }
        if (ele.fileName.match(reg).join("") === "贷前调查确认函") {
          this.dqdcEnter[ele.fileName.match(reg).join("")] = [];
          this.dqdcType[ele.fileName.match(reg).join("")] = ele.fileName
            .match(reg)
            .join("");
        }
      });
      filterRes[0].urls.forEach(ele => {
        if (ele.fileName.match(reg).join("") !== "贷前调查确认函") {
          this.allContract[ele.fileName.match(reg).join("")].push(ele);
        }
        if (ele.fileName.match(reg).join("") === "贷前调查确认函") {
          this.dqdcEnter[ele.fileName.match(reg).join("")].push(ele);
        }
      });
      this.agreementActive = Object.keys(this.contractType)[0];
      this.otherActive = Object.keys(this.dqdcType)[0];
      this.disposeResearch(list);
    },
    disposeResearch(list) {
      const imgCheck = {
        RESEARCH: "贷前调查",
        RESEARCHOTHER: "其他"
      };
      let type = Object.prototype.toString.call(list);
      if (type === "[object Object]") return;
      let keys = Object.keys(imgCheck);
      let filterImg = list.filter(ele => keys.includes(ele.imgType));
      if (filterImg.length === 0) return;
      filterImg.forEach(v => {
        v.urls.forEach(ele => {
          this.dqdcEnter[imgCheck[v.imgType]] = [];
          this.dqdcType[imgCheck[v.imgType]] = imgCheck[v.imgType];
        });
        v.urls.forEach(ele => {
          this.dqdcEnter[imgCheck[v.imgType]].push(ele);
        });
      });
    }
  },
  computed: {
    ...mapState({
      approvalData: state => state.approval.approvalData,
      dicts: state => state.common.dicts
    })
  }
};
</script>

<style lang="less">
@import "../../../assets/css/global.less";
.case-detatil-one {
  .case-detatil-one {
    .el-form-item--mini.el-form-item,
    .el-form-item--small.el-form-item {
      margin-bottom: 10px;
    }
  }
  .el-textarea.is-disabled .el-textarea__inner,
  .el-input.is-disabled .el-input__inner {
    color: @theme-color;
  }
  .case-title {
    font-weight: 650;
    color: #666666;
    margin: 20px 0;
    font-size: 20px;
  }
  .line-details {
    width: 100%;
    height: 1px;
    background: #666666;
    margin: 20px 0;
  }
}
</style>
